<template>
	<view class="content">
		<scroll-view scroll-y="true" class="scroll_h">
			<view class="right_card" v-for="v in list" :key="v.childdeptId" @click="goDep(v)">
				<view class="list">
					<view class="list_content">
						<view class="title" v-if="v.dept_name">
							{{v.dept_name}}
						</view>
						<view class="brand" v-if="v.deptlabel">
							<view class="tips">
								{{v.deptlabel}}
							</view>

						</view>
					</view>
					<view class="data" v-show="v.isHaveSource">
						有号
					</view>
					<view class="no_data" v-show="v.isHaveSource == false">
						无号
					</view>
				</view>
			</view>
			<view  class="empty" v-if="showEmp">
				<u-empty mode="data" iconSize="80" textSize="18" :icon="emptyList" text="暂无科室信息" v-if="list.length  == 0"></u-empty>
			</view>
		</scroll-view>
	</view>
</template>

<script>
	export default {
		name: "hosp-details-hot-dep",
		data() {
			return {
			//showEmp:false,
			emptyList: require('@/static/icons/empty_list.png') //空列表
			};
		},
		computed:{
			list(){
				//console.log(this.$store.state.doc.DepItemList);
				return this.$store.state.doc.DepItemList
			},
			showEmp(){
			   return this.$store.state.doc.hosFrozen 
			}
			
		},
		methods:{
			goDep(params){
				uni.navigateTo({
					url:`/pages/sousuo/search_dep_details/index?departmentId=${params.childdeptId}`
				})
			}
		},
		beforeDestroy() {
			 this.$store.state.doc.hosFrozen = false
		}
	}
</script>

<style lang="scss" scoped>
	.content {
		//padding-top: 30rpx;
		//padding-bottom: 100rpx;
		.scroll_h {
			height: 920rpx;
			.empty{
				display: flex;
				align-items: center;
				justify-content: center;
				height: 90%;
			}
		}

		.right_card {
			padding: 12rpx 0 20rpx 20rpx;
			display: flex;
			background: #FFFFFF;
			border-radius: 10rpx;
			margin-bottom: 20rpx;
			position: relative;

			.list {
				width: 80%;
				.list_content {
					//width: 100%;
					display: flex;
					flex-direction: column;

					.title {
						font-size: 26rpx;
						font-weight: 500;
						color: #333333;
						line-height: 28rpx;
						
					}

					.brand {
						display: flex;

						.tips {
							margin-top: 10rpx;
							background: #EAEFFF;
							border-radius: 8rpx;
							font-size: 18rpx;
							font-weight: 400;
							color: #3F80FF;
							padding: 0 18rpx;
							line-height: 20px;
						}
					}
				}

				.data {
					position: absolute;
					top: 0;
					right: 0;
					font-size: 20rpx;
					font-weight: 400;
					color: #FFFFFF;
					background: #43C163;
					border-radius: 0 8rpx 0 8rpx;
					padding: 8rpx 10rpx;
				}

				.no_data {
					position: absolute;
					top: 0;
					right: 0;
					font-size: 20rpx;
					font-weight: 400;
					color: #FFFFFF;
					border-radius: 0 8rpx 0 8rpx;
					padding: 8rpx 10rpx;
					background: #979797;
				}
			}


		}
	}
</style>